<app-editor [(ngModel)]="data" (ngModelChange)="basicForm.patchValue($event)" [submitting]="submitting" (submit)="submit()">

  <nz-collapse [formGroup]="basicForm" (change)="change()">
    <nz-collapse-panel nzHeader="基本信息" nzActive>
      <nz-form-item>
        <nz-form-label [nzSpan]="5">名称</nz-form-label>
        <nz-form-control [nzSpan]="12" nzErrorTip="">
          <input nz-input formControlName="name" required/>
        </nz-form-control>
      </nz-form-item>

      <nz-form-item>
        <nz-form-label [nzSpan]="5">产品</nz-form-label>
        <nz-form-control [nzSpan]="12" nzErrorTip="">
          <app-choose-product formControlName="product_id" [showClear]="true"></app-choose-product>
        </nz-form-control>
      </nz-form-item>

      <nz-form-item>
        <nz-form-label [nzSpan]="5">通道</nz-form-label>
        <nz-form-control [nzSpan]="12" nzErrorTip="">
          <app-choose-tunnel formControlName="tunnel_id" (tunnel)="onTunnel($event)"></app-choose-tunnel>
        </nz-form-control>
      </nz-form-item>

      <nz-form-item *ngIf="!basicForm.value.product_id">
        <nz-form-label [nzSpan]="5">组态</nz-form-label>
        <nz-form-control [nzSpan]="12" nzErrorTip="">
          <app-choose-hmi formControlName="hmi" [showClear]="true"></app-choose-hmi>
        </nz-form-control>
      </nz-form-item>


      <nz-form-item *ngIf="!basicForm.value.product_id">
        <nz-form-label [nzSpan]="5">标签</nz-form-label>
        <nz-form-control [nzSpan]="12" nzErrorTip="">
          <nz-select nzAllowClear nzMode="tags" [nzTokenSeparators]="[',', '，', ';', ' ']" formControlName="tags"
                     nzSize="small" (ngModelChange)="change()"></nz-select>
        </nz-form-control>
      </nz-form-item>

      <nz-form-item>
        <nz-form-label [nzSpan]="5">从站号</nz-form-label>
        <nz-form-control [nzSpan]="12" nzErrorTip="">
          <nz-input-number formControlName="station" [nzMin]="1" [nzMax]="65535" [nzStep]="1"></nz-input-number>
        </nz-form-control>
      </nz-form-item>

      <nz-form-item>
        <nz-form-label [nzSpan]="5">禁用</nz-form-label>
        <nz-form-control [nzSpan]="12" nzErrorTip="">
          <nz-switch formControlName="disabled"></nz-switch>
        </nz-form-control>
      </nz-form-item>

    </nz-collapse-panel>

    <ng-container *ngIf="!basicForm.value.product_id">

      <nz-collapse-panel nzHeader="数据点" nzActive>
        <app-edit-points formControlName="points" [codes]="codes"></app-edit-points>
      </nz-collapse-panel>

      <nz-collapse-panel nzHeader="数据轮询" nzActive>
        <app-edit-pollers formControlName="pollers" [codes]="codes"></app-edit-pollers>
      </nz-collapse-panel>

      <nz-collapse-panel nzHeader="控制命令" nzActive>
        <app-edit-commands formControlName="commands" [points]="basicForm.value.points"></app-edit-commands>
      </nz-collapse-panel>

      <nz-collapse-panel nzHeader="报警器" nzActive>
        <app-edit-validators formControlName="validators" [points]="basicForm.value.points"></app-edit-validators>
      </nz-collapse-panel>

      <nz-collapse-panel nzHeader="计算器" nzActive>
        <app-edit-calculators formControlName="calculators"></app-edit-calculators>
      </nz-collapse-panel>

    </ng-container>

  </nz-collapse>


</app-editor>
